@import './themeDark.scss'; //暗黑主题皮肤
@import './variables.module.scss';
@import './mixin.scss';
@import './transition.scss';
@import './element-ui.scss';
@import './sidebar.scss';


*{margin: 0;padding: 0;box-sizing: border-box;}
body {
  height: 100%;
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
  font-family: Helvetica Neue, Helvetica, PingFang SC, Hiragino Sans GB, Microsoft YaHei, Arial, sans-serif;
}
ul,li{list-style: none;}

label {
  font-weight: 700;
}

html {
  height: 100%;
  box-sizing: border-box;
}

#app {
  height: 100%;
  background-color: var(--user-app-background);
}

*,
*:before,
*:after {
  box-sizing: inherit;
}

a:focus,
a:active {
  outline: none;
}

a,
a:focus,
a:hover {
  cursor: pointer;
  color: inherit;
  text-decoration: none;
}

div:focus {
  outline: none;
}

.clearfix {
  &:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
  }
}

/*==========页面中基本的样式==========*/
::-webkit-scrollbar {
	width: 5px;
	height: 6px;
}

::-webkit-scrollbar-button,
::-webkit-scrollbar-button:vertical {
	display: none;
}

::-webkit-scrollbar-track,
::-webkit-scrollbar-track:vertical {
	background-color: #FAFAFA;
}

::-webkit-scrollbar-track-piece {
	background-color: #FAFAFA;
}

::-webkit-scrollbar-thumb,
::-webkit-scrollbar-thumb:vertical {
	margin-right: 10px;
	background-color: #EBEBEB;
  height:6px;
  border-radius: 6px;
}

::-webkit-scrollbar-thumb:hover,
::-webkit-scrollbar-thumb:vertical:hover {
	background-color: #EBEBEB;
}

::-webkit-scrollbar-corner,
::-webkit-scrollbar-corner:vertical {
	background-color: #FAFAFA;
}

::-webkit-scrollbar-resizer,
::-webkit-scrollbar-resizer:vertical {
	background-color:#FAFAFA;
}

// main-container global css
.app-container {
  padding: 20px;
}


.formBox{
  .formTitle{text-align: center;margin-top: 40px;font-size: 18px;}
  .el-form{max-width: 800px; margin: 20px auto; color: #666;}
  
}
.el-select{
  display: block;
}

.main{padding: 0 15px;}

// 布局
.el-main{
  position: relative;
}

button{border: none;border-radius: 5px;}


.tree-doc{
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  background: url('~@/assets/icon/mec-tree-doc.svg') no-repeat;
}
.tree-workflow{
  width: 16px;
  height: 16px;
  display: inline-block;
  vertical-align: middle;
  margin-right: 10px;
  background: url('~@/assets/icon/mec-tree-workflow.svg') no-repeat;
}

.is-expanded>.el-tree-node__content{
  .tree-doc{
    background: url('~@/assets/icon/mec-tree-docopen.svg') no-repeat;
    
  }
}



// 符合表单
.fuheForm{
  .el-select .el-input {
    width: 140px;
    color:#595959;
  }
  .input-with-select .el-input-group__prepend {
    background-color: #fff;
  }
}

.membeForm{
  
  .input-with-select {
    .el-select{
      width: 100px;
    }
    .el-input-group__prepend {
      background-color: #fff;
   
    }
  }
}

.permissionTree{
  .el-tree-node__content{
    position: relative;
    .el-tree-node__expand-icon{
      position: absolute;
      right: 0;
    }
  }
}

//head中覆盖弹出的默认效果
.elpopver88{padding: 0px; margin:0px; width:336px; height: 312px;
  .el-tabs__nav{padding:8px 0;
    .el-tabs__active-bar{width:58px;height: 1px;color:#ccc; background-color:#1890FF}
    .el-tabs__item{color: #666;
    }
    .el-tabs__item.is-active,.el-tabs__item:hover{color:#1890FF}
  }
  .el-tabs__content{
    .el-tab-pane{
      .iconfont{color:rgba(163, 177, 191, 0.4); font-size:80px; margin:38px 0 0 120px}
      .iconfontText{color:rgba(0, 0, 0, 0.45);font-size: 14px; margin:0 0 0 108px;}
    }
  }

}

// 大弹窗的样式
.bigDialog{
  .el-dialog__body{
    padding:10px 30px;
  }
}

// 弹窗中的表格
.dialogTable{
  padding: 0 !important;
  .cy-table{margin-top: 10px !important;}
  .cy-pagination{text-align: center !important;}

}

// 我的项目-》项目配置tabs样式
.projectTabs{
  .el-tabs__nav-scroll{
    padding-left: 64px;
  }
    
    .el-tabs__content{
      overflow: initial;
    }
}





// tab右边的按钮
.titleBtn{
  position: absolute;
  right: 32px;
  top: -65px;
  display: flex;
  >.el-button{
    margin-left: 10px;
  }
}


// 资源管理input和select组合
.resInputSelect{
  .el-input-group__append{width: 68px;}
}
// 
.searchForm{
  position: absolute;
  right: 0;
  top: -65px;
  padding-right: 32px;
}

// 状态
.stateIcon{
  width: 6px;
  height: 6px;
  border-radius: 50%;
  display: inline-block;
  vertical-align: middle;
  margin-right: 7px;

  &.apply{
    background: #1890FF;
  }
  &.approval{
    background: #2BD84C;
  }
  &.cancel{
    background: #CCCCCC;
  }
  &.refuse{
    background: #F93E3E;
  }
  &.change{
    background: #F5A720;
  }

  &.effective{
    background: #1890FF;
  }
  &.invalid{
    background: #CCCCCC;
  }
}

//角色权限 按钮选择框样式
.perBtnStyle{
  .el-checkbox__input.is-checked+.el-checkbox__label{
    color: #555658 !important;
  }
}

.stateQuery{margin-left: 10px;}

//用户管理 减少组织加省略号
.radioOrg {
  span.el-radio__label{
  display: inline-block;
  width:158px;
  overflow: hidden;
  text-overflow:ellipsis;
  white-space: nowrap;}
}


.indexTabs .el-tabs__nav-wrap{
  padding-left: 40px;
  line-height: 50px;
  &::after{height: 1px;}
}



.collapse{
  
border: 1px solid var(--user-color-line);
  .el-collapse-item__header{
    padding-left: 20px;
      background-color: #FAFAFA;
      border-bottom:1px solid var(--user-color-line);
      font-size: 14px;
  }

  .el-collapse-item__content{padding-bottom: 0;}
}


pre{
  white-space: pre-wrap;
  word-wrap:break-word;
}
pre code.hljs {
      margin-top: 16px;
      border: 1px solid var(--user-color-line);
    display: block;
    overflow-x: auto;
    padding: 1em;
    
    
}
code {
    display: block;
    font-family: Consolas, Monaco, monospace;
    font-size: 10pt;
    overflow-x: auto;
    padding: 0.5em;
    scrollbar-width: thin;
    -moz-tab-size: 4;
    tab-size: 4;
    
}



.labelColor{
  width: 24px;
  height: 24px !important;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-right: 20px;
  border-radius: 2px;
  .el-radio__inner{
    border: none;
    background: none;

      width: 14px;
      height: 14px;

    &:hover{
      border: none;
    }
    
    
  }
  .el-radio__input.is-checked .el-radio__inner{
    background: none;
    border: none;
    &::after{
      content: '';
    width: 10px;
    height: 5px;
    border: 2px solid white;
    border-top: transparent;
    border-right: transparent;
    text-align: center;
    display: block;
    position: absolute;
    top: 4px;
    left: 3px;
    transform: rotate(-45deg);
        border-radius: 0px;
    background: none;
    }
  }

  .el-radio__label{
    display: none;
  }
}

.labelColor0{
  background: #9C9C9C !important;
}
.labelColor1{
  background: #277AF5 !important;
}
.labelColor2{
  background: #2BD84C !important;
}
.labelColor3{
  background: #8F4DF2 !important;
}
.labelColor4{
  background: #F5A720 !important;
}
.labelColor5{
  background: #F93E3E !important;
}

.editTabs{
  .el-tabs__nav-wrap {
    padding-left: 52px;
  }
  .el-tabs__content{
    overflow: visible;
  }
}


.tooltip {
  text-align: left;
  position: absolute;
  font-size: 12px;
  background-color: white;
  border-radius: 3px;
  box-shadow: rgb(174, 174, 174) 0px 0px 10px;
  cursor: pointer;
  display: inline-block;
  padding: 10px;
}




// 标题 左边带蓝色条纹
.titleTag{
  color: var(--user-color-text2);
  font-size: 16px;
  &::before{
    content: '';
    width: 2px;
    height: 18px;
    background: var(--el-color-primary);
    display: inline-block;
    vertical-align: middle;
  }
}